<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
    <title>ES6中的Object.defineProperty</title>
    <script type="text/javascript" src="../js/vue.js"></script>
    <script type="text/javascript">
      Vue.config.productionTip = false;
    </script>
  </head>
  <body>
    <script type="text/javascript">
      let Number = 20;
      //定义一个对象
      let person = {
        name: "张三",
        sex: "男",
        //age:18
      };

      //需要传递三个参数，指定对象，属性，值
      Object.defineProperty(person, "age", {
        // value: 18,
        // //默认不能作为枚举，就是不能遍历。需要添加参数支持枚举
        //enumerable: true,
        // //控制是否可以被修改，默认false
        // writable:true,
        // //控制是否可以被删除，默认false
        // configurable:true,

        //当有人读取person的age属性时，get函数会被调用，且返回值是get的值  get:function(){}  可简写为 get()
        get: function () {
          console.log("触发了读取操作，年龄为：" + Number);
          return Number;
        },
        set(value) {
          console.log("触发了修改操作，且收到具体值：" + value);
          Number = value;
        },
      });

      //console.log(Object.keys(person));

      console.log(person);
    </script>
  </body>
</html>
